<template>
    <view class="mine-view">
        <view class="material-view">
            <view class="material-head">
                <image src="/static/pc/succeed-icon.png" class="material-image"></image>
                <view class="head-text">更换头像</view>
            </view>
        </view>
        <view class="info-data">
            <view class="data-item">
                <view class="text">注册手机</view>
                <view class="numb">913</view>
            </view>
            <view class="data-item">
                <view class="text">顾问工号</view>
                <view class="numb">7000</view>
            </view>
            <view class="data-item">
                <view class="text">会员等级</view>
                <view class="numb">十八</view>
            </view>
        </view>
        <view class="line"></view>
        <view class="material-status">
            <view class="data-item">
                <view class="text">账户名称</view>
                <view class="numb">913</view>
                <view class="but">去实名</view>
            </view>
            <view class="data-item">
                <view class="text">银行账号</view>
                <view class="text" style="font-weight: 600;">共<span style="color: #FF453B;font-size: 22px;">5</span>个</view>
                <view class="but">去查看</view>
            </view>
            <view class="data-item">
                <view class="text">联系地址</view>
                <view class="text" style="font-weight: 600;">共<span style="color: #FF453B;font-size: 22px;">5</span>个</view>
                <view class="but">去查看</view>
            </view>
        </view>
    </view>
</template>

<script>
export default {
    data() {
        return {

        };
    },
    methods: {}
}
</script>

<style scoped lang="scss">
.mine-view {
    width: 100%;
    background: white;
    padding: 50px 30px;
    min-height: 610px;

    .material-view {
        width: 100%;

        .material-head {
            @extend .column;

            .material-image {
                width: 128px;
                height: 128px;
            }

            .head-text {
                @extend .row;
                margin-top: 15px;
                width: 64px;
                height: 27px;
                border-radius: 4px;
                border: 1px solid #FF453B;
                font-family: PingFangSC, PingFang SC;
                font-weight: 400;
                font-size: 12px;
                color: #FF453B;
                line-height: 17px;
                text-align: left;
                font-style: normal;
            }
        }
    }

    .info-data {
        margin: 34px 150px 0 150px;
        @extend .row-between;

        .data-item {
            font-family: PingFangSC, PingFang SC;
            font-weight: 400;
            font-size: 14px;
            color: #1F0C00;
            line-height: 20px;
            text-align: center;
            font-style: normal;

            .numb {
                color: #1F0C00;
                font-size: 22px;
                font-weight: 600;
                line-height: 20px;
                margin-top: 4px;
            }
        }
    }

    .line {
        margin: 30px 0;
        height: 1px;
        background: #E8DED6;
    }

    .material-status {
        margin: 34px 150px 0 150px;
        @extend .row-between;

        .data-item {
            font-family: PingFangSC, PingFang SC;
            font-weight: 400;
            font-size: 14px;
            color: #1F0C00;
            line-height: 20px;
            text-align: center;
            font-style: normal;

            .numb {
                color: #FF453B;
                font-size: 22px;
                font-weight: 600;
                line-height: 20px;
                margin-top: 4px;
            }

            .but {
                margin-top: 12px;
                @extend .row;
                width: 64px;
                height: 26px;
                background: #FFFFFF;
                border-radius: 2px;
                border: 1px solid #FF453B;
                font-weight: 400;
                font-size: 14px;
                color: #FF453B;
                line-height: 20px;
            }
        }
    }

}
</style>